var topdiv = document.querySelector(".top")
var prev = document.querySelector(".prev")
var next = document.querySelector(".next")
var imgs = document.querySelectorAll(".top img")
var spans = document.querySelectorAll(".bottom span")

imgs[0].style.opacity = '1'
spans[0].style.backgroundColor = 'orange' 
//函数
var lunbo = function(){
	if(index < 4){
		index++
	}else{
		index = 0
	}
	for(var i=0; i<imgs.length; i++){
		imgs[i].style.opacity = '0'
		spans[i].style.backgroundColor = '#e5cdaa' 
	}
	imgs[index].style.opacity = '1'
	spans[index].style.backgroundColor = 'orange' 
}

//自动轮播 
var index = 0
setInterval(() => {
	lunbo()
},2500)

// 下一张按钮
next.onclick = function(){
	lunbo()
}

// 上一张按钮
prev.onclick = function(){
	if(index > 0){
		index--
	}else{
		index = 4
	}
	for(var i=0; i<imgs.length; i++){
		imgs[i].style.opacity = '0'
		spans[i].style.backgroundColor = '#e5cdaa' 
	}
	imgs[index].style.opacity = '1'
	spans[index].style.backgroundColor = 'orange' 
}

//点击圆点
for(let i =0; i<spans.length; i++){
	spans[i].onclick = function(){
		for(var j=0; j<imgs.length; j++){
			imgs[j].style.opacity = '0'
			spans[j].style.backgroundColor = '#e5cdaa' 
		}
		spans[i].style.backgroundColor = 'orange' 
		imgs[i].style.opacity = '1'
		index = i
	}
}















